/**
 * 仪表读数
 * @author truexin
 * @date   16/08/04
 * @reviseDate  16/08/11
 */
import NoData from '../components/NoData.js';
import PullRefresh from '../components/mui/PullRefresh.js';

var lf = liefeng,
    RC = React.createClass,
    R = React,
    ajax = lf.utils.ajax;

let noData = {
    span_text: '暂无仪表读数',
};

var Container = RC({
    getInitialState() {
        return ({
            readingList: [],
            houseNum: '',
            noData: false,
        })
    },
    componentWillMount() {
        let user = this.props.user;
        this.getHouseNum(user);
    },
    getHouseNum(user) {
        let me = this;
        ajax({
            type: 'get',
            data: {
                houseId: user.houseId,
            },
            success: function (data) {
                me.setState({
                    houseNum: data.data.houseNum
                });
                me.getReadingList(user, me.state.houseNum);
            }
        }, lf.finger.api.household.getHouseInfo);
        
    },
    getReadingList(user, houseNum) {
        let me = this;
        ajax({
            type: 'post',
            data: {
                projectId: user.projectId,
                houseNum: houseNum,
                // meterType: 1,仪表类型【1：水表；2：电表；3：燃气表】，当为空的时候则把三表的读数都查出来
            },
            success: function (data) {

                let readingList = data.dataList ? data.dataList.reverse() : [];
                me.setState({
                    readingList: readingList
                })
                if (!readingList.length) {
                    me.setState({
                        noData: true,
                    })
                }
            }
        }, lf.finger.api.fee.getCurrNumList);
    },
    
    render() {
        
        let list = !this.state.noData ? this.state.readingList.map(function (list) {
            return <div className="mui-table-view-cell flex">
                <p className="flex-item">
                    {list.yearofmonth}
                </p>
                <p className="flex-item">{list.water ? list.water : ' '}</p>
                <p className="flex-item">{list.electric ? list.electric : ' '} </p>
                <p className="flex-item">{list.gas ? list.gas : ' '} </p>
            </div>
        }) : <NoData data={noData}/>;
        
        return <div className="meter-reading">
            <div className="mui-table-view-cell flex reading-title">
                <p className="flex-item">日期</p>
                <p className="flex-item">水表</p>
                <p className="flex-item">电表</p>
                <p className="flex-item">燃气表</p>
            </div>
            {list}
        </div>
    }
})
lf.appJs.getUser(function (user) {
    R.render(
        <PullRefresh data={<Container user={user}/>}/>,
        document.getElementById('root'), function () {
        }
    )
})
